<template>
    <view>
        <!-- pages/myincome/makerincome/storetotal/index.wxml -->
        <view class="section">
            <view class="text-c">当前门店销售大礼包（含创客卡）总数</view>
            <view class="text-c">
                <text>{{ total }}</text>
                张
            </view>
            <view class="text-c">截止时间: {{ currentDay }}</view>
        </view>
        <view class="item-sub">分时段查询销售大礼包（含创客卡）总数</view>
        <view class="section">
            <picker mode="date" :value="startDay" @change="bindStartDayChange">
                <view class="picker">
                    选择销售起始时间：
                    <text>{{ startDay ? startDay : tip }}</text>
                </view>
            </picker>
        </view>
        <view class="section">
            <picker mode="date" :value="endDay" @change="bindEndDayChange">
                <view class="picker">
                    选择销售截止时间：
                    <text>{{ endDay ? endDay : tip }}</text>
                </view>
            </picker>
        </view>
        <view class="section">查询结果：{{ count }}</view>

        <view class="item-sub">
            <view class="item-btn" @tap="onQuery">查询</view>
        </view>
    </view>
</template>

<script>
// pages/myincome/makerincome/storetotal/index.js
import _request from '../../../../utils/request.js';

const moment = require('../../../../utils/moment.min');

export default {
    data() {
        return {
            startDay: '',
            endDay: '',
            currentDay: moment().format('YYYY-MM-DD'),
            tip: '点击选择',
            count: 0,
            total: 0,
            countClone: ''
        };
    }
    /**
     * 生命周期函数--监听页面加载
     */,
    onLoad: function (options) {
        this.setData({
            total: options.count || 0
        });
        this.onQuery();
    },
    /**
     * 生命周期函数--监听页面初次渲染完成
     */
    onReady: function () {},
    /**
     * 生命周期函数--监听页面显示
     */
    onShow: function () {},
    /**
     * 生命周期函数--监听页面隐藏
     */
    onHide: function () {},
    /**
     * 生命周期函数--监听页面卸载
     */
    onUnload: function () {},
    /**
     * 页面相关事件处理函数--监听用户下拉动作
     */
    onPullDownRefresh: function () {},
    /**
     * 页面上拉触底事件的处理函数
     */
    onReachBottom: function () {},
    /**
     * 用户点击右上角分享
     */
    onShareAppMessage: function () {},
    methods: {
        bindStartDayChange(e) {
            this.setData({
                startDay: e.detail.value
            });
        },

        bindEndDayChange(e) {
            this.setData({
                endDay: e.detail.value
            });
        },

        onQuery() {
            _request
                .get('/store/getStoreCardSum', {
                    userId: uni.getStorageSync('userid'),
                    startDay: this.startDay ? moment(this.startDay).format('YYYYMMDD') : '',
                    endDay: this.endDay ? moment(this.endDay).format('YYYYMMDD') : ''
                })
                .then((res) => {
                    if (res.data.code == 200) {
                        this.setData({
                            count: res.data.data || 0
                        });
                    } else {
                        uni.showToast({
                            title: res.data.message || '查询失败!',
                            icon: 'error'
                        });
                    }
                })
                .catch((error) => {
                    console.log(error);
                });
        }
    }
};
</script>
<style>
/* pages/myincome/makerincome/storetotal/index.wxss */
.section {
    margin: 10rpx 24rpx;
    border-radius: 10rpx;
    background: white;
    padding: 24rpx;
}
.text-c {
    text-align: center;
    padding: 24rpx;
}
.section .picker text {
    color: #737272;
    padding-left: 24rpx;
}
.text-c text {
    font-size: 62rpx;
    font-weight: bold;
}
.item-sub {
    padding: 24rpx;
    margin-top: 32rpx;
}
.item-btn {
    text-align: center;
    border-radius: 10rpx;
    background: white;
    padding: 18rpx;
    border: 1px solid #e2e2e282;
}
</style>
